<template>
  <a-card class="min-h-[68px] rounded my-[10px]"
          :body-style="{ padding: '0 20px 30px' }"
          :bordered="false">
    <!-- 头部返回列表功能 -->
    <template #extra>
      <a-button class="border-none"
                icon="rollback"
                @click="rollback">{{ $t("app.setting.themecolor.rr99") }}
      </a-button>
    </template>
    <!-- <a-progress v-bind:width="400" stroke-linecap="square" :percent="questionnaireInfo.percent"
                :steps="questionnaireInfo.ModelTopicOver"
                :format="percent => `${thisProcess}/${questionnaireInfo.ModelTopicCount}`"/> -->
    <!-- 正文头部 -->
    <div slot="title">
      <a-space>
        <div class="ty"></div>
        {{ $route.query.DpiaId }}
      </a-space>
    </div>
    <!-- 头部导航+查看RPA详情 -->
    <div style="margin: 30px 10px 0px 20px">
      <div style="display: flex; justify-content: space-between">
        <!-- 查看详情 -->
        <div style="
            margin-left: 20px;
            margin-top: -6px;
            right: 0;
            position: absolute;
            margin-right: 20px;
            z-index: 5;
          ">
          <rpaDetail :rpaDetailId="id" />
        </div>
      </div>
    </div>

    <div class="card-box">
      <div class="card-left">
        <!-- 章节列表 -->
        <a-row>
          <a-col :span="24">
            <div class="card-left">
              <p class="left-title">
                {{ $t("user.verification-code.required11156611036") }}
              </p>
              <ul style="padding-left: 15px">
                <li v-for="(item, i) in chapterLists"
                    :key="item.title">
                  <a-space align="center">
                    <a-badge status="processing"
                             style="margin-right: -40px; margin-bottom: 3px"
                             v-if="item.check" />
                    <a-button type="link"
                              @click="changeChapter(item, i)">{{ item.title }}
                              <span v-if="item.state ==0 &&DpiaReturnId !=0" style="color: red;margin-left:8px">(New)</span>
                              <span v-if="item.state ==1&&DpiaReturnId !=0" style="color: orangered;margin-left:8px">(Updated)</span>
                    </a-button>
                  </a-space>
                </li>
              </ul>
            </div>
          </a-col>
        </a-row>
        <!-- 转办备注 -->
        <a-row v-if="ifSeeAll">
          <a-col :span="24">
            <div class="card-left max">
              <p class="left-title1">
                {{ $t("user.verification-code.required111566110577258") }}
              </p>
              <a-timeline>
                <a-timeline-item v-for="item in transferList"
                                 :key="item.Id">
                  <div>
                    {{ item.DpiaCommentsDCO + item.DpiaCommentsCreatetime }}
                  </div>
                  <div>
                    {{ $t("user.verification-code.required1115661105763") }}：{{
                      item.DpiaCommentsTypeStr
                    }}
                  </div>
                  <div>
                    <span>{{
                      $t("user.verification-code.required111566181")
                    }}</span>{{ item.DpiaCommentsInfo ? item.DpiaCommentsInfo : "无" }}
                  </div>
                </a-timeline-item>
              </a-timeline>
            </div>
          </a-col>
        </a-row>
        <!-- 退回备注 -->
        <a-row v-if="ifSeeAll">
          <a-col :span="24">
            <div class="card-left max">
              <p class="left-title">
                {{ $t("user.verification-code.required1115661105772588888") }}
              </p>
              <a-timeline>
                <a-timeline-item v-for="item in returnList"
                                 :key="item.Id">
                  <div>
                    {{ item.DpiaCommentsDCO + item.DpiaCommentsCreatetime }}
                  </div>
                  <div>
                    {{ $t("user.verification-code.required1115661105763") }}：{{
                      item.DpiaCommentsTypeStr
                    }}
                  </div>
                  <div>
                    <span>{{
                      $t("user.verification-code.required111566181")
                    }}</span>{{ item.DpiaCommentsInfo ? item.DpiaCommentsInfo : "无" }}
                  </div>
                </a-timeline-item>
              </a-timeline>
            </div>
          </a-col>
        </a-row>
        <!-- 交换意见(左侧) -->
        <a-row v-if="ifSeeAll">
          <a-col :span="24">
            <div class="card-left max">
              <p class="left-title11">
                {{ $t("user.verification-code.required11156611057737144226") }}
              </p>
              <a-timeline>
                <a-timeline-item v-for="item in exchangelist"
                                 :key="item.Id">
                  <div>{{ item.DpiaCommentsCreatetime }}</div>
                  <div>
                    {{ $t("user.verification-code.required1115661105763") }}：{{
                      item.DpiaCommentsTypeStr
                    }}
                  </div>
                  <div>
                    <span>{{ $t(item.DpiaCommentsDCO) }}</span>:{{ item.DpiaCommentsInfo ? item.DpiaCommentsInfo : "无" }}
                  </div>
                </a-timeline-item>
              </a-timeline>
            </div>
          </a-col>
        </a-row>
      </div>

      <!-- 主列表 -->
      <div class="card-right">
        <a-row>
          <a-space class="mb-[15px]">
            <div class="tags"></div>
            {{ $t("user.verification-code.required11156611050") }}
          </a-space>
          <!-- 答题内容 -->
          <div v-if="RpaNoPIOrImportantInvolved ==1 ">
            <p>Dear DCO,</p>
            <p>This is a DPIA that does not involve any Personal Information or Important Data.</p>
            <p>You can check business user activity details clicking the upper right button RPA Details.</p>
            <p>If you have no further questions, you can post your comment and close this DPIA. </p>
            <p>if you still have questions, please get back to the user. </p>
          </div>
          <a-table v-if="RpaNoPIOrImportantInvolved ==0"
                   ref="table"
                   size="middle"
                   class="h-full overflow-x-auto"
                   :pagination="dpiaSimpleAnswerPagination"
                   :dataSource="dpiaSimpleAnswerLists"
                   :rowKey="(record) => record.Id"
                   @change="tableChange">
            <!-- 题目 -->
            <a-table-column key="DpiaChapterTopic"
                            data-index="DpiaChapterTopic"
                            width="200px">
              <span slot="title"
                    class="min-w-90p">{{
                $t("user.verification-code.required11156611055")
              }}</span>
            </a-table-column>
            <a-table-column key="DpiaChapterTopicAnswer"
                            data-index="DpiaChapterTopicAnswer"
                            width="200px">
              <span slot="title"
                    class="min-w-90p">{{
                $t("user.verification-code.required111566110056")
              }}</span>
              <span key="DpiaChapterTopicAnswer"
                    slot-scope="text, record">
                <span v-html="text"></span>
              </span>
            </a-table-column>
          </a-table>
          <!-- 2. -->
          <div>{{Question2Topic}}</div>
          <a-table ref="table"
                   v-if="RpaNoPIOrImportantInvolved ==0 && this.dpiaSimpleAnswerLists2.length > 0"
                   size="middle"
                   class="h-full overflow-x-auto mb-[80px]"
                   :pagination="dpiaSimpleAnswerPagination"
                   :dataSource="dpiaSimpleAnswerLists2"
                   :rowKey="(record) => record.Id"
                   @change="tableChange"
                   width="150px">
            <!-- 数据字段 -->
            <a-table-column key="SourceChildNames"
                            data-index="SourceChildNames"
                            >
              <span slot="title"
                    class="min-w-90p">{{
                $t("user.v122")
              }}</span>
            </a-table-column>
             <!-- 处理目的及必要性 -->
             <a-table-column key="PurposeNecessityHandling"
                            data-index="PurposeNecessityHandling"
                           >
              <span slot="title"
                    class="min-w-90p">{{
                $t("user.v123")
              }}</span>
            </a-table-column>
             <!-- 最小必要类型 -->
             <a-table-column key="MinimumNecessaryType"
                            data-index="MinimumNecessaryType"
                            >
              <span slot="title"
                    class="min-w-90p">{{
                $t("user.v124")
              }}</span>
            </a-table-column>
             <!-- 通过何种途径取得个人同意 -->
             <a-table-column key="ObtainPersonalConsent"
                            data-index="ObtainPersonalConsent"
                            >
              <span slot="title"
                    class="min-w-90p">{{
                $t("user.v125")
              }}</span>
            </a-table-column>
             <!-- 备注: -->
             <a-table-column key="remarks"
                            data-index="remarks"
                           >
              <span slot="title"
                    class="min-w-90p">{{
                $t("user.verification-code.required111566181")
              }}</span>
            </a-table-column>
          </a-table>

          <!-- Action列表 -->
          <div v-if="pia">
            <a-space class="mb-[15px]"
                     v-if="ifSeeAll">
              <div class="tags"></div>
              {{ $t("user.verification-code.required11156611051") }}
            </a-space>
            <div class="mb-[20px]"
                 v-if="!bianjike && ifSeeAll">
              <!-- 新建Action -->
              <a-button type="primary"
                        icon="plus"
                        @click="createActions">{{ $t("user.verification-code.required11156611052") }}
              </a-button>
            </div>
            <div class="mb-[70px]"
                 v-if="ifSeeAll">
              <a-table ref="table"
                       size="middle"
                       class="h-full overflow-x-auto"
                       :dataSource="dpiaSimpleActionLists"
                       :pagination="false"
                       :rowKey="(record) => record.Id">
                <a-table-column key="DpiaActionName"
                                data-index="DpiaActionName">
                  <span slot="title"
                        class="min-w-90p">{{
               $t("user.verification-code.required1115661105711")
             }}</span>
                </a-table-column>
                <a-table-column key="DpiaActionInfo"
                                data-index="DpiaActionInfo">
                  <span slot="title"
                        class="min-w-90p">{{
               $t("user.verification-code.required111566173")
             }}</span>
                </a-table-column>
                <a-table-column key="action"
                                :title="$t('menu.exception.not-find')"
                                width="80px">
                  <template slot-scope="text, record">
                    <span>
                      <!-- 编辑 -->
                      <a-button type="link"
                                @click="editActions(record.Id)"
                                v-if="!bianjike">{{
                     $t("user.verification-code.required1115661102")
                   }}</a-button>
                      <a-popconfirm :title="
                     $t('user.verification-code.required111566110577225')
                   "
                                    :ok-text="$t('user.verification-code.required1166')"
                                    :cancel-text="$t('user.email.required11')"
                                    @confirm="delActions(record.Id)">
                        <a-button type="link"
                                  v-if="!bianjike">{{
                     $t("menu.exception.trigger")
                   }}</a-button>
                      </a-popconfirm>
                      <!-- <a-button type="link" @click="delActions(record.Id)">{{ $t('menu.exception.trigger') }}</a-button> -->
                    </span>
                  </template>
                </a-table-column>
              </a-table>
              <!-- 分页 -->
              <a-pagination size="small"
                            style="
             float: right;
             right: 0;
             position: absolute;
             margin-top: -420px;
           "
                            v-model="dpiaSimpleActionPagination.page"
                            :total="dpiaSimpleActionPagination.total"
                            hideOnSinglePage
                            :pageSize.sync="dpiaSimpleActionPagination.pageSize"
                            @change="actions" />
            </div>
          </div>

          <div class="mb-[70px]"
               v-if="ifSeeAll">
            <!-- DCO评估 -->
            <a-space>
              <div class="tags"></div>
              {{ $t("user.verification-code.required11156611053") }}
            </a-space>
            <div class="mt-[10px]">
              <div>
                <span>{{ username }}   {{ $t("now.in") }} {{ DCDUtime }}</span>
              </div>
              <br />
              <a-textarea v-model="dcoRemark"
                          @change="onchange"
                          :placeholder="
                  $t('user.verification-code.required1115661105311')
                "
                          :disabled="bianjike"
                          :rows="4" />
            </div>
          </div>
          <div class="mb-[70px]"
               v-if="exchangeAlllist.length > 0 && ifSeeAll">
            <a-space>
              <div class="tags"></div>
              {{ $t("user.verification-code.required11156611057737144226") }}
            </a-space>
            <!--            <div class="mt-[10px]" v-if="ifflag">-->
            <!--              <span>{{ $t("now.user") }}</span>-->
            <!--              <a-textarea-->
            <!--                  v-model="textdata"-->
            <!--                  :placeholder="-->
            <!--                  $t('user.verification-code.required11156611057737144226')-->
            <!--                "-->
            <!--                  :rows="4"-->
            <!--                  @change="changemark(textdata)"-->
            <!--              />-->
            <!--            </div>-->
            <div class="mt-[10px]"
                 v-for="item in exchangeAlllist"
                 :key="item.Id">
              <div class="dlex">
                <!-- <span>交换意见：{{ item.DpiaCommentsDCO }}</span> -->
                <span>{{ item.DpiaCommentsDCO }}  {{ $t("now.in")
                  }}{{ item.Updatetime }}</span>
                  <a-button @click="undo(item)" icon="undo" v-if="!bianjike">
                    {{ $t("user.verification-code.required11156611057713322")}}
                  </a-button>
              </div>
              <a-textarea v-model="item.DpiaCommentsInfo"
                          :placeholder="
                  item.LxDpiaCommentsState === 0
                    ? $t('user.verification-code.required111566110577373')
                    : item.DpiaCommentsInfo
                    ? $t('user.verification-code.required11156611057737144226')
                    : $t('user.verification-code.required111566110577374')
                "
                          :rows="4"
                          @change="changemark(item.DpiaCommentsInfo)"
                          :disabled="
                  item.DpiaCommentsDCOid != $store.state.user.info.YtId ||
                  !ChangeCommit
                " />
            </div>
          </div>
        </a-row>
      </div>
    </div>
    <div :style="{
        position: 'fixed',
        right: 0,
        bottom: 0,
        width: '100%',
        borderTop: '1px solid #e9e9e9',
        padding: '20px 16px',
        background: '#fff',
        textAlign: 'center',
        zIndex: 1,
      }">
      <a-button @click="rollback()"
                style="margin-right: 20px">{{
        $t("app.setting.themecolor.rrrrrr")
      }}</a-button>
      <!-- 保存 -->
      <a-button @click="saveBAo()"
                type="primary"
                v-if="!bianjike"
                style="margin-right: 20px">{{ $t("user.verification-code.required111566110577200") }}
      </a-button>
      <!-- 交换意见 -->
      <a-button @click="exchange(record)"
                type="primary"
                v-if="!bianjike"
                style="margin-right: 20px">{{ $t("user.verification-code.required11156611057737144226") }}
      </a-button>
      <!-- <a-button @click="dcoBackoffShow()" type="primary" style="margin-right: 20px;">{{ $t('user.verification-code.required111566110577265') }}</a-button> -->
      <!-- 退回 -->
      <a-button @click="dcoBackoffShow()"
                v-if="!bianjike"
                style="margin-right: 20px">{{ $t("user.verification-code.required111566110577265") }}
      </a-button>
      <!-- 转办 -->
      <a-button type="primary"
                @click="transferShow()"
                v-if="!bianjike"
                style="margin-right: 20px">{{ $t("user.verification-code.required111566110577299") }}
      </a-button>
      <!-- 上一模块 -->
      <a-button type="primary"
                v-show="num != 0 && num != undefined"
                @click="next('black', num--)"
                :loading="buttonLoading"
                style="margin-right: 20px">{{ $t("user.verification-code.required11156611057725911") }}
      </a-button>
      <!-- 保存 -->
      <!-- <a-button type="primary" @click="savePush1()" v-if="bianjike">
         保存 
      </a-button> -->
      <!-- 下一模块/完成评估 -->
      <a-button type="primary"
                @click="
          chapterLists.length - 1 > num ? next('next', num++) : savePush()
        "
                v-if="!bianjike"
                :loading="buttonLoading"
                :style="
          chapterLists.length - 1 > num
            ? 'transition-duration: 0s'
            : 'margin-left: 20px; transition-duration: 0s'
        ">
        {{
          chapterLists.length - 1 > num
            ? this.$t("user.verification-code.required111566110577259")
            : this.$t("user.verification-code.required111566110577260")
        }}
      </a-button>
      <a-button type="primary"
                @click="
          chapterLists.length - 1 > num ? next('next', num++) : savePush1()
        "
                v-if="
          (bianjike && chapterLists.length - 1 > num) ||
          (chapterLists.length - 1 == num && ChangeCommit && ifSeeAll)
        ">
        {{
          chapterLists.length - 1 > num
            ? this.$t("user.verification-code.required111566110577259")
            : ifchaning || ChangeCommit
            ? this.$t("user.verification-code.required111566110577372")
            : this.$t("user.verification-code.required111566110577200")
        }}
      </a-button>
      <!-- 转办 -->
      <a-modal v-model="visible"
               @ok="transfer"
               :okText="$t('user.verification-code.required111566110577261')"
               :closable="false"
               width="400px"
               :cancel-text="$t('user.email.required11')"
               v-if="!bianjike">
        <a-space>
          <div class="tags"></div>
          {{ $t("user.verification-code.required111566110577262") }}
        </a-space>
        <br /><br />
        <a-form :label-col="{ span: 7 }"
                :wrapper-col="{ span: 17 }">
          <a-form-item :label="$t('user.v140')">
            <a-select :placeholder="$t('user.v141')"
                      v-model="dco"
                      show-search
                      option-filter-prop="children"
                      :filter-option="filterOption">
              <a-select-option v-for="item in userList"
                               :value="item.value"
                               :key="item.value">
                {{ item.label }}
              </a-select-option>
            </a-select>
          </a-form-item>
          <a-form-item :label="$t('user.verification-code.required111566181')">
            <a-textarea :placeholder="$t('user.verification-code.required1115661812233')"
                        v-model="dcoNote"
                        :rows="4"></a-textarea>
          </a-form-item>
        </a-form>
      </a-modal>

      <!-- 退回 -->
      <a-modal v-model="dcoBackoffVisible"
               @ok="dcoBackoff"
               :okText="$t('user.verification-code.required111566110577265')"
               :closable="false"
               width="300px"
               :cancel-text="$t('user.email.required11')">
        <a-row>
          <a-col>
            <a-space>
              <div class="tags"></div>
              {{ $t("user.verification-code.required111566110577266") }}
            </a-space>
          </a-col>
        </a-row>
        <a-row>
          <a-col style="margin: 0">
            <a-textarea :placeholder="$t('user.verification-code.required1115661812233')"
                        v-model="dcoNote"
                        style="margin-top: 10px; height: 100px"
                        :rows="4"></a-textarea>
          </a-col>
        </a-row>
      </a-modal>
    </div>
    <!-- 交换意见 -->
    <CoferDrow ref="CoferDrow"
               :chapterId="chapterId"
               :idname="idname"
               :id="id"
               :username="username"
               :DcoId22="DcoId22"
               :idd="idd"
               @success="getExchangeSee"
               @successAll="getExchangeSeeAll"
               >
    </CoferDrow>
    <!-- Action的创建 -->
    <createAction ref="createAction"
                  :questionId="id"
                  :chapterId="chapterId"
                  @succeed="actions" />
                  <!-- 撤回弹框 -->
    <a-modal  :visible="undoshow" :title="$t('user.verification-code.required11156611057713333')" 
    @ok="handleOk"  @cancel="handleCancel">
      <a-form :form="form" :label-col="{ span: 7 }" :wrapper-col="{ span: 16 }">
      <a-form-item
        label="DCO"
      >
        <span>{{ DpiaCommentsDCO }}</span>
      </a-form-item>
      <!-- 222222 -->
      <a-form-item
        :label="$t('breach.steps.step2.business.form.call.remark')"
      >
        <a-textarea
          v-model="DpiaCancelRemark"
          :placeholder="
            $t('breach.steps.step2.business.form.call.remark')
          "
          :auto-size="{ minRows: 3, maxRows: 5 }"
        />
      </a-form-item>
    </a-form>
    </a-modal>
  </a-card>
</template>

<script>
import {
  dpiaChangeState,
  dpiaCompleteAssessment,
  dpiaCompleteAssessmentPush,
  dpiaDcoBackoff,
  dpiaDcoRemarkInfo,
  dpiaDcoRemarkInfoUpdate,
  dpiaDcoTransfer,
  dpiaQuestionAnswerCreate,
  dpiaQuestionChangeStatus,
  dpiaQuestionChapterLists,
  dpiaQuestionInfo,
  dpiaSimpleAction,
  dpiaSimpleAnswer,
  exchangeList,
  exchangeSee,
  rickActiondel,
  transferDetails,
  exchangecancel
} from '@/api/dpia/form'
import Readio from './readio.vue'
import Checkbox from './checkbox.vue'
import Esitory from './esitory.vue'
import Four from './four.vue'
import RpaDetail from './components/rpaDetail.vue'
import CreateAction from './components/createAction.vue'
import { DcoQuery, userQuery } from '@/api/common/form'
import CoferDrow from './components/coferDorw.vue'
import { getUserInfo } from '@/api'
import { quesionFindRpaId, rpaDetail } from '@/api/rpa/form'
export default {
  components: {
    Readio,
    Checkbox,
    Esitory,
    Four,
    CoferDrow,
    RpaDetail,
    CreateAction, // 创建Action
  },

  data() {
    return {
      // DCO评估结果
      dcoRemark: undefined,
      exchangeAlllist: [],
      // 章节答题内容
      columns: [
        // {
        //   title: '题目类型',
        //   className: 'min-w-90p',
        //   dataIndex: 'DpiaChapterTopicType',
        //   scopedSlots: { customRender: 'topicTypeAction' },
        //   align: 'center',
        // },
        {
          title: '题目',
          width: '440px',
          dataIndex: 'DpiaChapterTopic',
          align: 'center',
        },

        {
          title: '回答内容',
          className: 'min-w-30p',
          dataIndex: 'DpiaChapterTopicAnswer',
          align: 'center',
          scopedSlots: { customRender: 'dpiaChapterTopicAnswer' },
        },
      ],
      // Action内容
      actionColumns: [
        {
          title: 'Action编号',
          className: 'min-w-90p',
          dataIndex: 'DpiaActionIdTag',
          align: 'center',
        },
        {
          title: '合规要求名称',
          className: 'min-w-90p',
          dataIndex: 'DpiaActionName',
          align: 'center',
        },
        {
          title: 'Action来源',
          className: 'min-w-90p',
          dataIndex: 'DpiaActionSource',
          align: 'center',
        },
        {
          title: '责任人',
          className: 'min-w-90p',
          dataIndex: 'DpiaActionUserResponsible',
          align: 'center',
        },
        {
          title: '发起时间',
          className: 'min-w-90p',
          dataIndex: 'DpiaActionCreatetime',
          align: 'center',
        },
        {
          title: '合规要求描述',
          className: 'min-w-90p',
          dataIndex: 'DpiaActionInfo',
          align: 'center',
        },
        {
          title: '操作',
          className: 'min-w-90p',
          dataIndex: '',
          align: 'center',
          scopedSlots: { customRender: 'action' },
        },
      ],
      dco: undefined,
      dcoNote: undefined,
      // DCO列表
      userList: [],
      // DCO按钮
      dcoButtom: false,
      //查看是否可以编辑
      bianjike: false,

      // 上一页按钮控制
      previousPageButtom: true,

      // 下一页按钮控制
      nextPageButtom: true,

      current: '',
      value: '',
      visible: false,
      //章节id
      Exid: '',
      idname: null,
      // DCO backoff的状态
      dcoBackoffVisible: false,

      // 配置分页
      dpiaSimpleAnswerPagination: {
        page: 1,
        pageSize: 10,
        total: 0,
      },
      dpiaSimpleActionPagination: {
        page: 1,
        pageSize: 10,
        total: 0,
      },
      idd: '',
      // 左侧的章节列表
      chapterLists: [],

      // 基础答题信息
      questionnaireInfo: {},

      // 问题和答案数据
      dpiaQuestionTopicAnswer: {},

      // 问卷ID
      id: '',
      //给被交换意见的id
      DcoId22: '',

      // 当前选中章节ID
      chapterId: null,
      username: null,
      DCDUtime: null,
      // 获取用户问题答案
      dpiaQuestionUserAnswer: {},
      DpiaUserId: '',
      // 加载状态
      buttonLoading: false,
      // 当前题型
      topicType: 0,

      // 是否结束
      finishStatus: 0,

      // 已答题的结果
      dpiaQuestionUserLastAnswer: '',

      // 答题章节内容
      dpiaSimpleAnswerLists: [],
      dpiaSimpleAnswerLists2:[],

      // Action列表
      dpiaSimpleActionLists: [],
      //下一章
      num: 0,
      //转办详情列表
      transferList: [],
      // 退回详情列表
      returnList: [],
      //交换意见列表
      exchangelist: [],
      //进度条
      thisProcess: null,
      // 判断当前是否己有当前用户的交换意见
      ifflag: true,
      // 交换意见设置
      ChangeCommit: 0,
      // 是否在进行评估
      ifchaning: localStorage.getItem('ifchaning') || false,
      lang: localStorage.getItem('lang').includes('zh-CN'),
      ifSeeAll: false,
      //特殊题型
      RpaIfCompletedPIA: 0,
      RpaNoPIOrImportantInvolved: 0,
      pia: false,
      isLable: null,
      DpiaReturnId:0,
      Question2Topic:'',
      // 撤回意见
      undoshow:false,
      DpiaCommentsDCOid:'',
      DpiaCommentsDCO:'',
      DpiaCancelRemark:''
    }
  },
  created() {
    this.init()
  },
  mounted() {
    localStorage.removeItem('ifchaning')
    let that = this
    window.addEventListener('setItemEvent', function (e) {
      if (e.key == 'lang') {
        let lang = JSON.parse(e.value)
        console.log(lang)
        if (lang == 'zh-EN') {
          that.lang = false
        } else {
          that.lang = true
        }
      }
    })
    this.ifSeeAll =
      this.$route.query?.DpiaCreateUser == this.$store.state.user.info.YtId ||
      this.$route.query.DpiaCreateUserId == this.$store.state.user.info.YtId ||
      this.$route.query.ChangeCommit == 1 ||
      this.$route.query.ifDco == 1 ||
      this.$route.query?.DpiaDcoUserId == this.$store.state.user.info.YtId
  },
  methods: {
    async getList() {
      try {
        // 默认获取第一章节
        const { data: dpiaSimpleAnswerObject } = await dpiaSimpleAnswer({
          id: this.id,
          DpiaChapterId: this.chapterId,
          lang: this.lang ? 0 : 1,
          page: this.dpiaSimpleAnswerPagination.Page,
          pageSize: this.dpiaSimpleAnswerPagination.pageSize,
        })
        const { Page, PageSize, Total, Lists,Question2,Question2Topic } = dpiaSimpleAnswerObject
        this.dpiaSimpleAnswerLists = Lists
        this.dpiaSimpleAnswerLists2 = Question2
        this.Question2Topic = Question2Topic

        if (this.RpaIfCompletedPIA == 1) {
          this.dpiaSimpleAnswerLists[0].DpiaChapterTopicAnswer =
            this.RpaPIALinkUrl
        }
        this.dpiaSimpleAnswerPagination = {
          page: Page,
          pageSize: PageSize,
          total: Total,
        }
      } catch (error) {
        console.log('error:', error)
        this.$message.error(error)
      }
    },
    //分页的方法
    tableChange(e, searchInputs, pagination) {
      this.dpiaSimpleAnswerPagination.Page = e.current
      this.getList()
    },
    async changemark(e) {
      try {
        // 判断状态是新增还是修改 调用不同的api
        await exchangeList({
          DpiaQid: this.id,
          DpiaChapterId: this.chapterId,
          DpiaCommentsDCOid: this.$store.state.user.info.YtId,
          DpiaCommentsDCO: this.$store.state.user.name,
          DpiaCommentsInfo: e,
          DpiaCommentsType: 4,
        })
        this.getExchangeSee()
        // this.getExchangeSeeAll()
      } catch (error) {
        console.log('error:', error)
        this.$message.error(error)
      }
      deep: true
    },
    async topicShow() {
      try {
        // 基础信息查询
        const { data: questionnaireInfo } = await dpiaQuestionInfo({
          id: this.id,
        })
        // console.log(this.dpiaSimpleAnswerLists.length);

        // 当前进度
        var thisProcess =
          (this.thisProcess / questionnaireInfo.ModelTopicCount) * 100
        // 百分比
        questionnaireInfo.percent = parseFloat(thisProcess).toFixed(2)
        // if (questionnaireInfo.percent == NaN) {
        //   questionnaireInfo.percent = 0
        // }
        questionnaireInfo.percent = eval(questionnaireInfo.percent)
        this.questionnaireInfo = questionnaireInfo
      } catch (error) {
        console.log('error:', error)
        this.$message.error(error)
      }
    },

    async next(state) {
      window.scrollTo({ top: 0, behavior: 'smooth' });
      let items = null
      if (this.num < this.chapterLists.length) {
        items = this.chapterLists[this.num]
      }

      // 如果是新的章节，默认给它重置一下
      // 保障是首次分页
      // 因为Current默认有效，所以，在重置时记得把current重置为1
      if (items.id != this.chapterId) {
        this.dpiaSimpleAnswerPagination = {
          page: 1,
          pageSize: 10,
          total: 0,
          current: 1,
        }
      }
      this.chapterId = items.id

      try {
        for (var i = 0; i < this.chapterLists.length; i++) {
          this.chapterLists[i].check = false
        }
        // 获取DCO评估结论
        const { data: remarkInfo } =
          this.bianjike == true
            ? await dpiaDcoRemarkInfo({
                DpiaQid: this.id,
                DpiaChapterId: items.id,
                DpiaChapterDcoUserId: this.$route.query.DpiaCreateUserId,
              })
            : await dpiaDcoRemarkInfo({
                DpiaQid: this.id,
                DpiaChapterId: items.id,
                DpiaChapterDcoUserId: this.$store.state.user.info.YtId,
              })
        // console.log("-----------------------------1", remarkInfo);
        this.dcoRemark = remarkInfo.DpiaChapterDcoRemark
        this.chapterId = items.id
        this.DCDUtime = remarkInfo.DpiaChapterDcoUpdatetime
        this.username = remarkInfo.DpiaChapterDcoUserName
        this.idd = remarkInfo.Id
        // console.log("this.chapterId", this.chapterId);
        items.check = true
        this.getAction(items)
        //获取交换意见列表
        this.getExchangeSee()
        await this.getExchangeSeeAll()
        if (state == 'black') {
          this.thisProcess -= this.dpiaSimpleAnswerLists.length
        }
        // 默认获取第一章节
        const { data: dpiaSimpleAnswerObject } = await dpiaSimpleAnswer({
          id: this.id,
          DpiaChapterId: items.id,
          lang: this.lang ? 0 : 1,
        })
        const { Page, PageSize, Total, Lists,Question2 ,Question2Topic} = dpiaSimpleAnswerObject
        this.Question2Topic = Question2Topic
        this.dpiaSimpleAnswerLists = Lists
        this.dpiaSimpleAnswerLists2 = Question2

        if (this.RpaIfCompletedPIA == 1) {
          this.dpiaSimpleAnswerLists[0].DpiaChapterTopicAnswer =
            this.RpaPIALinkUrl
        }
        this.dpiaSimpleAnswerPagination = {
          page: Page,
          pageSize: PageSize,
          total: Total,
        }
        if (state == 'next') {
          this.thisProcess += this.dpiaSimpleAnswerLists.length
        }
        this.topicShow()
      } catch (error) {
        this.$message.error(error)
      }
    },
    async savePush() {
      this.buttonLoading = true
      // 提交保存
      try {
        // 判断是否完成评估
        const { data } = await dpiaCompleteAssessment({
          Id: this.id,
        })

        if (!data) {
          // 交换意见未达成
          this.$message.error(this.$t('dpia.completeAssessment.error'))
          this.buttonLoading = false
        } else {
          // 变更状态，跳转到整体评估
          await dpiaChangeState({
            Id: this.id,
            DpiaStatus: 3,
          })
          this.$message.success(
            this.$t('user.verification-code.required111566171')
          )
          this.$router.push({
            path: '/dpia/onequestion/overall',
            query: { ...this.$route.query, id: this.id, isLable:this.$route.query.isLable},
          })
        }
      } catch (error) {
        this.$message.error(error)
        this.buttonLoading = false
      }
    },
    async savePush1() {
      const { data: userinfo } = await getUserInfo()

      if (this.ChangeCommit === 1 || this.ifchaning) {
        // 交换意见的提交
        const { data } = await dpiaCompleteAssessmentPush({
          Id: this.id,
          DpiaCommentsExchangeDcoId: userinfo.YtId,
        })
      }
      if (this.bianjike) {
        this.$router.push({ path: '/dpia' })
      } else {
        this.$message.success(
          this.$t('user.verification-code.required111566110577375')
        )
        this.ChangeCommit = 0
      }
      return
    },
    editActions(id) {
      // 编辑action
      this.$refs.createAction.open(id, 'edit', true)
    },
    createActions() {
      // 创建Action

      this.$refs.createAction.open(undefined, undefined, true)
    },
    async dcoBackoffShow() {
      this.dcoBackoffVisible = true
    },
    async dcoBackoff() {
      // DCO退回
      try {
        // console.log(this.dcoNote);
        await dpiaDcoBackoff({ id: this.id, DpiaCommentsInfo: this.dcoNote })
        this.$router.push({ path: '/dpia/service' })
        this.$message.success(
          this.$t('user.verification-code.required111566110577267')
        )
        this.dcoNote = undefined
        this.dcoBackoffVisible = false
      } catch (error) {
        this.$message.error(error)
      }
    },
    // 获取安全需求列表
    async getAction(items) {
      const { page, pageSize } = this.dpiaSimpleActionPagination
      // 默认获取第一章节
      const { data: dpiaSimpleActionObject } = await dpiaSimpleAction({
        Id: this.id,
        ChapterId: items.id,
        page,
        pageSize,
      })
      const {
        Page: Page1,
        PageSize: PageSize1,
        Total: Total1,
        Lists: Lists1,
      } = dpiaSimpleActionObject

      this.dpiaSimpleActionLists = Lists1
      this.dpiaSimpleActionPagination = {
        page: Page1,
        pageSize: PageSize1,
        total: Total1,
      }
    },
    // 点击章节改变
    async changeChapter(items, i) {
      if (i) {
        this.num = i
      } else {
        this.num = 0
      }
      // 如果是新的章节，默认给它重置一下
      // 保障是首次分页
      // 因为Current默认有效，所以，在重置时记得把current重置为1
      if (items.id != this.chapterId) {
        this.dpiaSimpleAnswerPagination = {
          page: 1,
          pageSize: 10,
          total: 0,
          current: 1,
        }
      }
      this.chapterId = items.id
      try {
        for (var i = 0; i < this.chapterLists.length; i++) {
          this.chapterLists[i].check = false
        }
        // console.log("this.DpiaUserId", this.DpiaUserId);
        // 获取DCO评估结论
        const { data: remarkInfo } =
          this.bianjike == true
            ? await dpiaDcoRemarkInfo({
                DpiaQid: this.id,
                DpiaChapterId: items.id,
                DpiaChapterDcoUserId: this.$route.query.DpiaCreateUserId,
              })
            : await dpiaDcoRemarkInfo({
                DpiaQid: this.id,
                DpiaChapterId: items.id,
                DpiaChapterDcoUserId: this.$store.state.user.info.YtId,
              })
        // console.log("remarkInfo", remarkInfo);
        this.dcoRemark = remarkInfo.DpiaChapterDcoRemark
        this.chapterId = items.id
        this.Exid = items.id
        // console.log(" this.Exid", this.Exid);
        this.idname = remarkInfo.DpiaChapterDcoUserId
        this.username = remarkInfo.DpiaChapterDcoUserName
        this.DCDUtime = remarkInfo.DpiaChapterDcoUpdatetime
        this.idd = remarkInfo.Id
        items.check = true
        // 默认获取第一章节
        const { data: dpiaSimpleAnswerObject } = await dpiaSimpleAnswer({
          id: this.id,
          DpiaChapterId: items.id,
          lang: this.lang ? 0 : 1,
        })
        const { Page, PageSize, Total, Lists ,Question2 ,Question2Topic} = dpiaSimpleAnswerObject
        
        this.dpiaSimpleAnswerLists = Lists
        this.dpiaSimpleAnswerLists2 = Question2
        this.Question2Topic = Question2Topic

        if (this.RpaIfCompletedPIA == 1) {
          this.dpiaSimpleAnswerLists[0].DpiaChapterTopicAnswer =
            this.RpaPIALinkUrl
        }
        this.dpiaSimpleAnswerPagination = {
          page: Page,
          pageSize: PageSize,
          total: Total,
        }

        const { page, pageSize } = this.dpiaSimpleActionPagination
        // 默认获取第一章节
        const { data: dpiaSimpleActionObject } = await dpiaSimpleAction({
          Id: this.id,
          ChapterId: items.id,
          page,
          pageSize,
        })
        const {
          Page: Page1,
          PageSize: PageSize1,
          Total: Total1,
          Lists: Lists1,
        } = dpiaSimpleActionObject

        this.dpiaSimpleActionLists = Lists1
        this.dpiaSimpleActionPagination = {
          page: Page1,
          pageSize: PageSize1,
          total: Total1,
        }
      } catch (error) {
        console.log('error:', error)
        this.$message.error(error)
      }
    },
    //保存
    async saveBAo(id) {
      this.$router.push({ path: '/dpia' })
      this.$message.success(
        this.$t('user.verification-code.required111566110577308')
      )
    },
    //交换意见
    async exchange() {
      await this.$refs.CoferDrow.open()
    },
    //删除action
    async delActions(id) {
      //调接口
      try {
        // 传过来的id直接请求删除api
        await rickActiondel({ Id: id })
        await this.actions()
        this.$message.success(
          this.$t('user.verification-code.required111566110577133')
        )
      } catch (error) {
        this.$message.error(error)
      } finally {
      }
    },
    async transfer() {
      // DCO转办
      try {
        if (this.dco == undefined) {
          this.$message.error(
            this.$t('user.verification-code.required111566110577268')
          )
          return
        }
        var dcoName = ''
        for (var i = 0; i < this.userList.length; i++) {
          if (this.userList[i].value == this.dco) {
            dcoName = this.userList[i].label
          }
        }
        await dpiaDcoTransfer({
          id: this.id,
          DpiaDco: dcoName,
          DpiaDcoUserId: this.dco,
          DpiaCommentsInfo: this.dcoNote,
        })
        this.$message.success(
          this.$t('user.verification-code.required1115661105772699999')
        )
        this.$router.push('/dpia')
        this.visible = false
        this.dcoNote = undefined
      } catch (error) {
        console.log('error:', error)
        this.$message.error(error)
      }
    },
    async transferShow() {
      // 转办的弹窗
      this.visible = true
      // 获取用户列表下拉
      const { data: userList } = await DcoQuery({ ApprovalAlias: 'DCO' })
      this.userList = userList.filter((item) => {
        return item.value !== this.$store.state.user.info.YtId
      })
    },
    async actions(state) {
      console.log(state);
      // 获取关联的Action
      try {
        let { page, pageSize } = this.dpiaSimpleActionPagination
        if (state == 'action') {
          page = 1
        }
        // console.log(page);
        // 默认获取第一章节
        const { data: dpiaSimpleActionObject } = await dpiaSimpleAction({
          Id: this.id,
          ChapterId: this.chapterId,
          page,
          pageSize,
        })
        const { Page, PageSize, Total, Lists } = dpiaSimpleActionObject
        console.log('ssss',dpiaSimpleActionObject);
        this.dpiaSimpleActionLists = Lists
        this.dpiaSimpleActionPagination = {
          page: Page,
          pageSize: PageSize,
          total: Total,
        }
      } catch (error) {
        console.log('error:', error)
        this.$message.error(error)
      }
    },
    async init() {
      try {
        // 初始化题库
        var id = this.$route.query.id
        this.DcoId22 = this.$route.query.DpiaChangeDcoId
        this.ChangeCommit = Number(this.$route.query.ChangeCommit)
        this.bianjike =
          Number(this.$route.query.ifDco) ||
          this.$route.query?.DpiaDcoUserId == this.$store.state.user.info.YtId
            ? false
            : true
        // this.bianjike = Number(this.$route.query.ifDco) ? false : true;
        this.id = id
        const { data: rpaDetails } = await quesionFindRpaId({ Id: id })
        this.DpiaReturnId = rpaDetails.DpiaReturnId
        // 获取RPA详情
        const { data: rpaDetailInfo } = await rpaDetail({
          Id: rpaDetails.DpiaRpaId,
        })
        this.RpaPIALinkUrl = rpaDetailInfo.RpaPIALinkUrl
        this.RpaIfCompletedPIA = rpaDetailInfo.RpaIfCompletedPIA
        if (
          rpaDetailInfo.RpaIfCompletedPIA == 1 ||
          rpaDetailInfo.RpaNoPIOrImportantInvolved == 1
        ) {
          this.pia = false
        }
        else{
          this.pia = true
        }
        this.RpaNoPIOrImportantInvolved =
          rpaDetailInfo.RpaNoPIOrImportantInvolved
        // 章节列表
        const { data: chapterLists } = await dpiaQuestionChapterLists({
          id: id,
        })
        this.chapterLists = chapterLists
        // console.log(this.chapterLists.length);
        // console.log(this.num);
        // 默认获取第一章节
        await this.changeChapter(this.chapterLists[0])
        this.thisProcess = this.dpiaSimpleAnswerLists.length

        // 获取初步评估Action
        await this.actions()

        //获取转办详情
        const { data } = await transferDetails({ Id: this.id })
        // console.log("datazhuan", data);
        this.transferList = data.filter((item) => {
          return item.DpiaCommentsType === 1
        })
        this.returnList = data.filter((item) => {
          return item.DpiaCommentsType === 2
        })
        /**
         * 获取交换意见列表
         */
        await this.getExchangeSeeAll()

        /**
         * 获取交换意见Timeline
         */
        await this.getExchangeSee()
        // 基础信息查询
        const { data: questionnaireInfo } = await dpiaQuestionInfo({
          id: this.id,
        })
        this.questionnaireInfo = questionnaireInfo
        this.topicShow()
      } catch (error) {
        console.log('error:', error)
        this.$message.error(error)
      }
    },
    /**
     * 获取交换意见列表
     * @returns {Promise<void>}
     */
    async getExchangeSeeAll() {
      //交换意见详情
      console.log('this.dpiaQuestionUserAnswer.chapter:', this.chapterId)
      const { data: data1 } = await exchangeSee({
        DpiaQid: this.id,
        DpiaChapterId: this.chapterId,
        DpiaCommentsType: 4,
      })
      var DpiaChapterDcoUserId = ''
      data1.forEach((item) => {
        if (item.DpiaCommentsDCOid !== this.$store.state.user.info.YtId) {
          DpiaChapterDcoUserId = item.DpiaCommentsDCOid
          if (!item.LxDpiaCommentsState) {
            item.DpiaCommentsInfo = ''
          }
        }
      })
      this.DpiaUserId = DpiaChapterDcoUserId

      // console.log("this.DpiaChapterDcoUserId", this.DpiaUserId);
      this.exchangeAlllist = data1
      // 遍历获取是否当前用户有可用的输入框
      data1.forEach((element) => {
        if (element.DpiaCommentsDCOid === this.DcoId22) {
          this.ifflag = false
        }
      })
    },
    async getExchangeSee() {
      //交换意见详情
      const { data: data1 } = await exchangeSee({
        DpiaQid: this.id,
        DpiaCommentsType: 3,
      })
      // console.log("datazhuanjiao", data1);
      var DpiaChapterDcoUserId = ''
      data1.forEach((item) => {
        if (item.DpiaCommentsDCOid !== this.$store.state.user.info.YtId) {
          DpiaChapterDcoUserId = item.DpiaCommentsDCOid
        }
      })
      this.DpiaUserId = DpiaChapterDcoUserId
      this.exchangelist = data1
      // 遍历获取是否当前用户有可用的输入框
      data1.forEach((element) => {
        if (element.DpiaCommentsDCOid === this.DcoId22) {
          this.ifflag = false
        }
      })
    },
    async pageInit(obj) {
      this.dpiaQuestionUserAnswer = obj
      try {
        // 获取答案
        if (this.dpiaQuestionUserAnswer != {}) {
          // 把答题的结果拿到
          await dpiaQuestionAnswerCreate({
            DpiaChapterId: this.dpiaQuestionUserAnswer.chapter,
            DpiaQid: this.id,
            DpiaChapterTopicId: this.dpiaQuestionUserAnswer.topic,
            DpiaChapterTopicAnswer: encodeURIComponent(this.dpiaQuestionUserAnswer.answer),
            DpiaChapterTopicType: this.dpiaQuestionTopicAnswer.topic.type,
          })
          // 清空答案
          this.dpiaQuestionUserAnswer = {}
        }
      } catch (error) {
        console.log('error:', error)
        this.$message.error(error)
      }
    },

    async showModal() {
      this.visible = true
      // 获取用户列表下拉
      const { data: userList } = await userQuery(1)

      this.userList = userList
    },
    async handleOk(e) {
      // 交卷
      if (this.dco == undefined) {
        this.$message.error(
          this.$t('user.verification-code.required111566110577268')
        )
        return
      }
      try {
        await dpiaQuestionChangeStatus({
          Id: this.id,
          DpiaStatus: 2,
          DpiaDcoUserId: this.dco,
        })
        this.$message.success(
          this.$t('user.verification-code.required111566110577270')
        )
      } catch (error) {
        console.log(error)
        this.$message.error(error)
      }

      this.topicShow()
      this.visible = false
      // 开启那个结果页
      this.finishStatus = 1
    },
    filterOption(input, option) {
      return (
        option.componentOptions.children[0].text
          .toLowerCase()
          .indexOf(input.toLowerCase()) >= 0
      )
    },
    rollback() {
      this.$router.push('/dpia/service')
    },
    async onchange(e) {
      // console.log(e);
      try {
        // 更新创建备注
        await dpiaDcoRemarkInfoUpdate({
          DpiaChapterDcoRemark: this.dcoRemark,
          DpiaQid: this.id,
          DpiaChapterId: this.chapterId,
        })
        // 获取DCO评估结论
        const { data: remarkInfo } =
          this.bianjike == true
            ? await dpiaDcoRemarkInfo({
                DpiaQid: this.id,
                DpiaChapterId: this.chapterId,
                DpiaChapterDcoUserId: this.$route.query.DpiaCreateUserId,
              })
            : await dpiaDcoRemarkInfo({
                DpiaQid: this.id,
                DpiaChapterId: this.chapterId,
                DpiaChapterDcoUserId: this.$store.state.user.info.YtId,
              })
        this.DCDUtime =
          remarkInfo.DpiaChapterDcoUpdatetime ||
          remarkInfo.DpiaChapterDcoCreatetime
        this.username = remarkInfo.DpiaChapterDcoUserName
      } catch (error) {
        console.log('error:', error)
        this.$message.error(error)
      }
    },
    async undo(e){
      this.DpiaCommentsDCOid = e.DpiaCommentsDCOid
      this.DpiaCommentsDCO =e.DpiaCommentsDCO
      if(e.DpiaCommentsInfo == ''){
        this.cancel()
      } else{
        this.undoshow=true
        
      }
    },
    async cancel(){
       //调接口
       try {
        // 传过来的id直接请求删除api
        const { data } = await exchangecancel({
          DpiaQid: this.id,
          DpiaCommentsDCOid: this.DpiaCommentsDCOid,
          DpiaCancelRemark:this.DpiaCancelRemark
        })
        this.$message.success(
          this.$t('user.verification-code.required11156611057713311')
        )
        this.getExchangeSeeAll()
      } catch (error) {
        this.$message.error(error)
      } finally {
      }
    },
    handleOk () {
      this.cancel()
      this.undoshow= false
    },
    handleCancel(e) {
      this.DpiaCommentsDCOid = ''
      this.undoshow= false
    },
  },
  watch: {
    // 实时监听当前用户是否有可编辑的输入框
    exchangelist: {
      deep: true, // 深度监听数组内部的变化
      handler(newVal, oldVal) {
        // console.log("数组发生变化", newVal, oldVal);
        // 遍历获取是否当前用户有可用的输入框
        const aflag = false
        this.exchangelist.forEach((element) => {
          if (element.DpiaCommentsDCOid == this.DcoId22) {
            aflag = true
          }
        })
        this.ifflag = !aflag
      },
    },
  },
}
</script>

<style lang="less" scoped>
/deep/ .ant-card-body {
  // display: flex;
  .buttomm {
    width: 100%;
  }

  .card-box {
    width: 100%;
    height: 100%;
    font-size: 15.5px;
    display: flex;
    overflow: auto;
    justify-content: space-between;
    height: auto;
    & > .card-left {
      height: 100%;
    }
  }

  .card-left {
    /*rectangle copy 4备份 87*/
    margin: 0 30px 30px 0;
    color: #444e84;
    left: 339px;
    top: 287px;
    width: 388px;
    min-height: 390px;
    opacity: 0.67;
    border-radius: 2px;
    background: #f7faff;
    &.max ul {
      max-height: 370px;
      overflow-y: scroll;
      &::-webkit-scrollbar {
        width: 8px;
      }
      &::-webkit-scrollbar {
        background-color: #fafcfe;
      }
      &::-webkit-scrollbar-thumb {
        background-color: #6299cf;
        border-radius: 10px;
      }
    }
    ul {
      margin-top: 10px;
    }
    ul li {
      padding: 3px;
    }
  }

  .left-title {
    color: #050c34;
    width: 100%;
    line-height: 40px;
    padding: 0 10px;
    padding-left: 20px;
    background: #e7f0ff;
    border-bottom: 1px solid #ddd;
  }

  .card-right {
    // margin: 30px 30px 30px 350px;
    flex: 1;
    z-index: 1;
    right: 0;
    width: auto;
  }

  p {
    color: #000;
  }
}

.tags {
  left: 298px;
  top: 288px;
  width: 6px;
  height: 14px;
  opacity: 1;
  border-radius: 2px;
  background: rgba(0, 80, 247, 1);
}

// .ant-pagination {
//   float: right;
// }

.left-title1 {
  color: #050c34;
  width: 100%;
  line-height: 40px;
  padding: 0 10px;
  padding-left: 20px;
  background: #e7f0ff;
  border-bottom: 1px solid #ddd;
}

.left-title11 {
  color: #050c34;
  width: 100%;
  line-height: 40px;
  padding: 0 10px;
  padding-left: 20px;
  background: #e7f0ff;
  border-bottom: 1px solid #ddd;
}

.ant-card {
  overflow: auto;
  height: auto;
}

[data-v-23a62919] [data-v-23a62919] .drawer-form .ant-form-item-label {
  display: inline-block;
  line-height: 20px;
  width: 100px;
  margin-right: 10px;
  margin-top: 10px;
  margin-left: 10px;
  overflow: visible !important;
  margin-right: 38px;
}

/deep/ .ant-card[data-v-fd046f26] {
  height: 2500px !important;
}

.dlex {
  display: flex;
  align-items: center;
  margin-bottom: 6px;
  justify-content: space-between;
}
</style>
